<script setup>
import {darkTheme, dateZhCN, zhCN} from 'naive-ui'
import Footer from "@/views/footer/Footer.vue";
import LeftSide from "@/views/sider/LeftSide.vue";
import MyHeader from "@/views/header/MyHeader.vue";
import Main1 from "@/views/main/Main1.vue";
import Main2 from "@/views/main/Main2.vue";
import Main3 from "@/views/main/Main3.vue";
import Main4 from "@/views/main/Main4.vue";
import Main5 from "@/views/main/Main5.vue";
import {onMounted, ref} from "vue";
import {useConfigStore} from '@/stores/config';
import {ipc} from "@/utils/ipcRenderer";
import {ipcApiRoute} from "@/api/rpcRouter";


const result = ref(1)
const configStore = useConfigStore();
const onMainIndexEven = (val) => {
  result.value = Number(val);
}

onMounted(() => {
  ipc.invoke(ipcApiRoute.getConfigByKey,"glob_key").then(res=>{
    configStore.setConfig(res)
  })
});

</script>

<template>
  <div>
    <n-config-provider
        class="wh-full"
        :locale="zhCN"
        :date-locale="dateZhCN"
        :theme="darkTheme"
    >
      <n-message-provider>

      <n-space vertical>
        <n-layout has-sider>
          <n-layout-sider width="250px" bordered content-style="padding: 24px;height: 100vh;" :native-scrollbar="false">
            <!--            左侧-->
            <LeftSide></LeftSide>
          </n-layout-sider>
          <n-layout style="position: relative" >
            <n-layout-header bordered position="absolute" style="height: 68px; padding: 24px 24px 0;">
              <!--          头部-->
              <MyHeader  @onMainIndexEven="onMainIndexEven"></MyHeader>
            </n-layout-header>
            <n-layout-content bordered position="absolute" style="margin-top: 68px;margin-bottom: 44px;padding: 10px 24px 0;"
                              :native-scrollbar="false">
              <!--            主要内容-->
              <Main1 v-if="result===1"></Main1>
              <Main2 v-if="result===2"></Main2>
              <Main3 v-if="result===3"></Main3>
              <Main4 v-if="result===4"></Main4>
              <Main5 v-if="result===5"></Main5>
            </n-layout-content>
            <n-layout-footer bordered position="absolute" style="padding: 10px 10px 0;">
              <!--    底部      -->
              <Footer/>
            </n-layout-footer>
          </n-layout>

        </n-layout>

      </n-space>
      </n-message-provider>

    </n-config-provider>
  </div>
</template>

<style scoped>

</style>
